 /*
 * @description: 规则展示
 * @Author: along
 * @Date: 2019-08-31
 * @Last Modified by: liyujie
 * @Last Modified time: 2020-12-31
 */
<template>
    <div class="page">
        <div class="wrapBageSet">
            <p class="wrapBageSet-title">
                规则说明:
            </p>
            <p class="wrapBageSet-list">
                <!--一、邀请者和被邀请者: 支持普通用户和校园精英发起邀请好友。邀请成功后,邀请者会获得一次抽奖机会和现金奖励，被邀请者会获得一张0元购学生券;<br>
                普通用户邀请好友,该好友成为普通用户上级的粉丝<br>
                <br>
                二、关于提现和算法:<br>
                1、该目标奖金和目标人数本质就是一个临界点,邀请达到这两个数值即可提现.<br>
                2、具体的逻辑:每拉取一个人都有固定的金额,拉到第六人(10.01)是个零界点,超过6人可以提现.<br>
                3、1～20人获取的时候都有个固定的金额;21～30每邀请一个得0.6元；31～40每邀请一个得0.3元；41-50每邀请一个得0.2元；51人以上每邀请一个得0.1元.<br>-->
                1. 注册奖励：新注册的好友可1分领取限量199元蓝系洗护礼盒、0元购商品及专属新人优惠券；<br>
                2. 邀请注册奖励：通过活动页邀请好友注册，最高可获得5元现金奖励。奖励在好友注册app并7天内累积实付金额满1元后发放（待入账）；<br>
                3. 邀请实付奖励：邀请的好友在注册后7天内累积实付金额满1元，最高可获得15元现金奖励（待入账）；<br>
                4. 若被邀请好友在注册7日内实付金额&lt;1元，系统将自动扣除待入账的注册奖励和实付奖励；<br>
                5. 若被邀请好友下单后发生退货、退款行为，导致其注册后7日内的累计实付金额&lt;1元，系统将自动扣除邀请人的注册奖励和实付奖励；<br>
                6. 好友注册后7日内累积实付金额满1元并完成结算之后，注册奖励和实付奖励入账【可提现金额】，满50元可提现至【我的-余额】；<br>
                7. 若发现用户通过不正当手段参与活动，掌上大学有权不发放、收回或以其他形式发放奖励；<br>
                8. 如因不可抗力、情势变更、相关政策变动、政府机关指令要求、网络攻击等原因导致本活动调整、暂停举办等，本平台有权随时修改、暂停、取消或终止活动，并无需为此承担任何法律责任；<br>
                9. 未尽事宜以掌上大学官方的处理和答复为准，最终解释权归掌上大学平台所有。<br>
            </p>

            <p class="wrapBageSet-title">
                规则设置 - 针对邀请者：
            </p>
            <div class="tips">*奖金规则改动需要慎重</div>
            <el-form
                :model="formData"
                ref="ruleForm"
                label-width="100px"
                :label-position="'right'"
            >
                <div class="rule-title">奖金规则1（&lt;30）</div>
                <el-form-item
                    label="注册奖金区间"
                >
                    <div class="wrap-time">
                        <el-input
                            v-model="formData.rule_1.award_money_register_min"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <span style="margin: 0 20px">至</span>
                        <el-input
                            v-model="formData.rule_1.award_money_register_max"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <p class="wrap-time-text">
                            注册奖金区间可调控范围：3~5
                        </p>
                    </div>
                </el-form-item>
                <el-form-item
                    label="下单奖金区间"
                >
                    <div class="wrap-time">
                        <el-input
                            v-model="formData.rule_1.award_money_pay_order_min"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <span style="margin: 0 20px">至</span>
                        <el-input
                            v-model="formData.rule_1.award_money_pay_order_max"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <p class="wrap-time-text">
                            下单奖金区间可调控范围：5~8
                        </p>
                    </div>
                </el-form-item>
                <div class="rule-title">奖金规则2（≥30）</div>
                <el-form-item
                    label="注册奖金区间"
                >
                    <div class="wrap-time">
                        <el-input
                            v-model="formData.rule_2.award_money_register_min"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <span style="margin: 0 20px">至</span>
                        <el-input
                            v-model="formData.rule_2.award_money_register_max"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <p class="wrap-time-text">
                            注册奖金区间可调控范围：1~3
                        </p>
                    </div>
                </el-form-item>
                <el-form-item
                    label="下单奖金区间"
                >
                    <div class="wrap-time">
                        <el-input
                            v-model="formData.rule_2.award_money_pay_order_min"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <span style="margin: 0 20px">至</span>
                        <el-input
                            v-model="formData.rule_2.award_money_pay_order_max"
                            size="small"
                            disabled
                            :style="{width: '160px'}"
                        >
                            <div
                                slot="suffix"
                                style="margin-right: 5px"
                            >元</div>
                        </el-input>
                        <p class="wrap-time-text">
                            下单奖金区间可调控范围：2~4
                        </p>
                    </div>
                </el-form-item>
                <div class="rule-title">非活动邀请用户： <span class="tips">用户不是通过邀请有礼活动注册，在注册页面填写邀请码，可获得邀请奖金；</span></div>
                <el-form-item
                    label="启动"
                >
                    <el-switch
                        v-model="formData.stuagent_default_invite"
                        style="margin-top: -8px"
                        :active-value="1"
                        :inactive-value="0"
                        disabled
                    />
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
export default {
    data () {
        return {
            formData: {
                rule_1: {
                    award_money_register_min: 0,
                    award_money_register_max: 0,
                    award_money_pay_order_min: 0,
                    award_money_pay_order_max: 0
                },
                rule_2: {
                    award_money_register_min: 0,
                    award_money_register_max: 0,
                    award_money_pay_order_min: 0,
                    award_money_pay_order_max: 0
                },
                stuagent_default_invite: 1,
            },
        };
    },
    directives: {
        //
    },
    watch: {},
    created () {
        this.getConfig();
    },
    mounted () {
        this.$store.commit('SET_HEADER', [{ title: "APP后台"},{title: '商城'},{title: '邀请有礼'},{title: '规则展示'}]);
    },
    methods: {
        /**
         * 获取规则配置
         */
        getConfig () {
            this.$post('/student/student_user_invite_award%5Cget_config',{},resp=>{
                if (resp.code === 1) {
                    let {rule_1, rule_2} = resp.data.award_money;
                    let {stuagent_default_invite} = resp.data;

                    this.formData = {rule_1, rule_2, stuagent_default_invite};
                } else {
                    this.$notify({
                        title: '提示',
                        message: resp.msg,
                        type: 'warning',
                        duration: 2000
                    });
                }
            });
        }
    }
};
</script>

<style lang="less" scoped>
.page {
    width: 100%;
}
.wrapBageSet {
    width: calc(100% - 64px);
    margin: 24px 32px;
    background:rgba(251,251,251,1);
    border-radius:2px;
    border:1px solid rgba(238,238,238,1);
    box-sizing: border-box;
    padding: 12px 32px 0px 32px;
    &-title {
        width: 100%;
        color: #333333;
        font-size: 14px;
        font-weight: 500;
        height: 38px;
        line-height: 38px;
        border-bottom: 1px #E9E9E9 solid;
        margin-bottom: 24px;
    }
    &-list {
        width: 1014px;
        padding: 16px 24px;
        box-sizing: border-box;
        color: #333333;
        font-size: 14px;
        letter-spacing: 0px;
        background:rgba(247,247,247,1);
        border-radius:4px;
        border:1px solid rgba(220,223,230,1);
        line-height: 22px;
        margin-bottom: 48px;
    }
    .wrap-time {
        height: 32px;
        display: flex;
        align-items: center;
        &-text {
            color: #999999;
            font-size: 14px;
            margin-left: 24px;
        }
        &-dw {
            color: #999999;
            font-size: 14px;
            margin-right: 24px;
            margin-left: 5px;
        }
        .wrap-tips, .wrap-tips-add {
            color: #999999;
            font-size: 14px;
            margin-left: -60px;
            position: relative;
            z-index: 10;
        }
        .wrap-tips-add {
            margin-left: -22px;
        }
    }
    .main {
        width: 777px;
        height: 384px;
        background: rgba(247,247,247,1);
        border: 1px solid rgba(220,223,230,1);
        box-sizing: border-box;
        padding: 24px 26px;
        display: flex;
        flex-direction: column;
        &-list {
            display: flex;
            align-items: center;
            height: 36px;
            margin-bottom: 24px;
            &-text {
                color: #333333;
                font-size: 14px;
                margin-right: 16px;
            }
            &-rate {
                color: #999999;
                font-size: 14px;
                margin-left: -20px;
                position: relative;
                z-index: 10;
            }
            &-tips {
                color: #999999;
                font-size: 14px;
                margin-left: 25px;
            }
        }
    }

    .rule-title {
        margin: 20px 0 24px;
        font-size: 16px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 600;
        color: #333333;
    }
    .tips {
        color: #999999;
        font-size: 12px;
    }
}
</style>

<style lang="less">
.wrapBageSet {
    .el-form-item__label {
        line-height: 32px;
    }
    .wrap-time-day .el-input__inner {
        pointer-events: none;
    }
}
</style>>
